<style>
  .signal{
  border:8px solid transparent;
  border-radius:100%;
  margin:0 auto;
}
.dot{
  height:0px;
  width:0px;
  background:#000;
  margin-top:8px;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  border-radius:50%;
}
.out{
  width:120px;
  height:120px;
  margin:60px auto;
  border-top-color:#000;
  -webkit-animation:outerSignal 3s infinite linear;
  -moz-animation:outerSignal 3s infinite linear;
  -o-animation:outerSignal 3s infinite linear;
  animation:outerSignal 3s infinite linear;
}
.middle{
  width:80px;
  height:80px;
  margin:10px auto;
  border-top-color:#000;
  -webkit-animation:middleSignal 3s infinite linear;
  -moz-animation:middleSignal 3s infinite linear;
  -o-animation:middleSignal 3s infinite linear;
  animation:middleSignal 3s infinite linear;
}
.in{
  width:40px;
  height:40px;
  margin:10px auto;
  border-top-color:#000;
  -webkit-animation:innerSignal 3s infinite linear;
  -moz-animation:innerSignal 3s infinite linear;
  -o-animation:innerSignal 3s infinite linear;
  animation:innerSignal 3s infinite linear;
}

@keyframes "innerSignal" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:#000;
  }
  75% {
    border-top-color:#000;
  }
  100% {
    border-top-color:#000;
  }
}
@keyframes "middleSignal" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:transparent;
  }
  75% {
    border-top-color:#000;
  }
  100% {
    border-top-color:#000;
  }
}
@keyframes "outerSignal" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:transparent;
  }
  75% {
    border-top-color:transparent;
  }
  100% {
    border-top-color:#000;
  }
}
@-webkit-keyframes "innerSignal" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:#000;
  }
  75% {
    border-top-color:#000;
  }
  100% {
    border-top-color:#000;
  }
}
@-webkit-keyframes "middleSignal" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:transparent;
  }
  75% {
    border-top-color:#000;
  }
  100% {
    border-top-color:#000;
  }
}
@-webkit-keyframes "outerSignal" {
  0% {
    border-top-color:transparent;
  }
  25% {
    border-top-color:transparent;
  }
  75% {
    border-top-color:transparent;
  }
  100% {
    border-top-color:#000;
  }
}
</style>
<div class="signal out">
    <div class="signal middle">
        <div class="signal in">
            <div class="signal dot">
            </div>
        </div>
    </div>
</div>